<template>
  <div>
    <div>
      <table class="gs-date--day" :class="[gsStyle ? 'gs-date-day--'+gsStyle:'']">
        <thead>
          <tr>
            <th><div v-html="'日'"></div></th>
            <th><div v-html="'一'"></div></th>
            <th><div v-html="'二'"></div></th>
            <th><div v-html="'三'"></div></th>
            <th><div v-html="'四'"></div></th>
            <th><div v-html="'五'"></div></th>
            <th><div v-html="'六'"></div></th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item,index) in dayDate" :key="index">
            <td>
              <div v-html="item.senve" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.one" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.two" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.three" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.four" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.five" @click="click">
              </div>
            </td>
            <td>
              <div v-html="item.six" @click="click">
              </div>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
    

  </div>
  
  
</template>
<script>
export default {
/**
 * @params long：长度
 * @params type: 输入类型
 * @params disabled: 禁用
 */
  name: 'gsDay',
  props:{
    date:String,
    gsStyle:String
  },
  model:{
    prop:'value',
    event:'gsinput'
  },
  data(){
    return {
      dayDate:[],
      tmpday:1,
      daySum:0,
    }
  },
  created(){
    this.createGetDays();
  },
  methods:{
    createGetDays(params){
      var tmpdate;
      if(params){
        tmpdate = new Date(params)
      }else if(this.date){
        tmpdate = new Date(this.date)
      }
      else{
        tmpdate = new Date();
      }
      let year = tmpdate.getFullYear();
      let month = tmpdate.getMonth();
      this.daySum = this.getDays(year,month) + 1
      const arr = []
      let i = 0
      for (i = 0; i < 6; i++) {
        let obj = this.setxqArr(year,month+1);
        arr.push(obj)
      }
      this.dayDate = arr;
      this.tmpday = 1;
    },
    setxqArr(year,month){
      let obj={}
      for (let i = 0; i < 7; i++) {
        if(this.tmpday==this.daySum)return obj
        if(new Date(String(year) + "-" +String(month) + "-"+ String(this.tmpday)).getDay() == 6){
          this.setXq(String(year) + "-" +String(month) + "-"+ String(this.tmpday),obj);
          this.tmpday++
          return obj
        }else{
          this.setXq(String(year) + "-" +String(month) + "-"+ String(this.tmpday),obj);
          this.tmpday++
        }
        
      }
      return obj
    },
    setXq(date,obj){
      const dt = new Date(date)
      if(dt.getDay()== 1){
        obj.one=dt.getDate()
      }
      if(dt.getDay()== 2){
        obj.two=dt.getDate()
      }
      if(dt.getDay()== 3){
        obj.three=dt.getDate()
      }
      if(dt.getDay()== 4){
        obj.four=dt.getDate()
      }
      if(dt.getDay()== 5){
        obj.five=dt.getDate()
      }
      if(dt.getDay()== 6){
        obj.six=dt.getDate()
      }
      if(dt.getDay()== 0){
        obj.senve=dt.getDate()
      }
      return obj
    },
    
    getDays(year,month){
      let days = [31,28,31,30,31,30,31,30,30,31,30,31] 
      if ( (year % 4 ===0) && (year % 100 !==0 || year % 400 ===0) ) {
        days[1] = 29
      }return days[month]
    },
    input(e){
      console.log(e)
      this.$emit("gsinput",e.target.value);
    },
    click(e){
      this.$emit('dayClick',e.target.innerText)
    }
  },
  
}
</script>



